<template>
  <lay-breadcrumb>
    <lay-breadcrumb-item
      v-for="(breadcrumb, index) in breadcrumbs"
      :key="index"
    >
      {{ breadcrumb.title }}
    </lay-breadcrumb-item>
  </lay-breadcrumb>
</template>

<script lang="ts">
export default {
  name: "GlobalBreadcrumb",
};
</script>

<script lang="ts" setup>
import { computed } from "vue";
import { useRoute } from "vue-router";
import { getParents } from "../../library/treeUtil";
import { useSystemStore } from "../../store/login";

const userSysStore = useSystemStore();
const route = useRoute();
const breadcrumbs = computed(() =>
  getParents([...userSysStore.menus], route.path)?.reverse(),
);
</script>
